<template>
	<view>
		<block v-for="(item,index) in list" :key="index">
			<view class="box">
				<view class="box_title">{{item.itemno}}、{{item.qname}}</view>
				<view class="boxes" v-if="item.option1">
					<block v-if="item.answer == 'option1##'||item.erroranswer == 'option1##'">
						<image :src="item.answer == 'option1##'?'/static/selectExam.png':'/static/imgDelete.png'" class="boxes_img"></image>
						<view class="boxes_text" :style="{color: item.answer == 'option1##' ? '#03AEA5':'#CD2B46'}">{{item.option1}}</view>
					</block>
					<block v-else>
						<view class="boxes_l">A</view>
						<view class="boxes_text">{{item.option1}}</view>
					</block>
				</view>
				<view class="boxes" v-if="item.option2">
					<block v-if="item.answer == 'option2##'||item.erroranswer == 'option2##'">
						<image :src="item.answer == 'option2##'?'/static/selectExam.png':'/static/imgDelete.png'" class="boxes_img"></image>
						<view class="boxes_text" :style="{color: item.answer == 'option2##'?'#03AEA5':'#CD2B46'}">{{item.option2}}</view>
					</block>
					<block v-else>
						<view class="boxes_l">B</view>
						<view class="boxes_text">{{item.option2}}</view>
					</block>
				</view>
				<view class="boxes" v-if="item.option3">
					<block v-if="item.answer == 'option3##'||item.erroranswer == 'option3##'">
						<image :src="item.answer == 'option3##'?'/static/selectExam.png':'/static/imgDelete.png'" class="boxes_img"></image>
						<view class="boxes_text" :style="{color: item.answer == 'option3##'?'#03AEA5':'#CD2B46'}">{{item.option3}}</view>
					</block>
					<block v-else>
						<view class="boxes_l">C</view>
						<view class="boxes_text">{{item.option3}}</view>
					</block>
				</view>
				<view class="boxes" v-if="item.option4">
					<block v-if="item.answer == 'option4##'||item.erroranswer == 'option4##'">
						<image :src="item.answer == 'option4##'?'/static/selectExam.png':'/static/imgDelete.png'" class="boxes_img"></image>
						<view class="boxes_text" :style="{color: item.answer == 'option4##'?'#03AEA5':'#CD2B46'}">{{item.option4}}</view>
					</block>
					<block v-else>
						<view class="boxes_l">D</view>
						<view class="boxes_text">{{item.option4}}</view>
					</block>
				</view>
			</view>
		</block>
		<view style="height: 150rpx;"></view>
		
		<view class="button" @click="skip">返回首页</view>
	</view>
</template>

<script>
	import { requestData } from 'util/request';
	export default {
		data() {
			return {
				list: [],
				answerid: '',
			};
		},
		
		onLoad(options) {
			let that = this
			
			let prama = {
				answerid: options.answerid
			}
			requestData('/qu/errorlist',prama).then(res=>{
				that.list = res.data
			})
			
			// uni.request({
			// 	url: getApp().globalData.url + '/qu/errorlist',
			// 	method: 'POST',
			// 	header: {
			// 		'content-type': 'application/x-www-form-urlencoded',
			// 		token: uni.getStorageSync('token')
			// 	},
			// 	data: {
			// 		answerid: options.answerid
			// 	},
			// 	success(res) {
			// 		that.list = res.data.data
			// 	}
			// })
		},
		
		methods: {
			skip(){
				uni.switchTab({
					url: '/pages/exam/exam'
				})
			},
		}
	}
</script>

<style lang="scss">
	page{
		background: #ECECEC;
	}
	.box{
		margin-top: 10rpx;
		margin-bottom: 30rpx;
		overflow: hidden;
		
		&_title{
			padding: 65rpx 40rpx;
			width: 670rpx;
			min-height: 60rpx;
			background: #03AEA5;
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 40rpx;
			color: #FFFFFF;
			line-height: 60rpx;
			overflow: hidden;
		}
		.boxes{
			margin-top: 10rpx;
			width: 750rpx;
			// height: 136rpx;
			background: #FFFFFF;
			overflow: hidden;
			
			&_img{
				float: left;
				margin: 42rpx 31rpx 42rpx 41rpx;
				width: 52rpx;
				height: 52rpx;
			}
			&_l{
				float: left;
				margin: 42rpx 31rpx 42rpx 41rpx;
				width: 52rpx;
				height: 52rpx;
				background: #FFFFFF;
				box-shadow: 0rpx 0rpx 5rpx 0rpx rgba(103,103,103,0.88);
				border-radius: 50%;
				text-align: center;
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 40rpx;
				color: #000000;
				line-height: 50rpx;
				overflow: hidden;
			}
			&_text{
				// height: 136rpx;
				// font-family: PingFang SC;
				// font-weight: 500;
				// font-size: 40rpx;
				// color: #000000;
				// line-height: 136rpx;
				float: left;
				margin-top: 44rpx;
				margin-bottom: 44rpx;
				width: 600rpx;
				min-height: 48rpx;
				font-family: PingFang SC;
				font-weight: 500;
				font-size: 40rpx;
				color: #000000;
				line-height: 48rpx;
			}
		}
	}
	.button{
		position: fixed;
		bottom: 0rpx;
		left: 0rpx;
		width: 750rpx;
		height: 120rpx;
		background: #03AEA5;
		text-align: center;
		font-family: PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #FFFFFF;
		line-height: 120rpx;
	}
</style>
